<template>
  <div>
    <nav>
      <ul>
        <li> <router-link to="/" exact>博客</router-link></li>
        <li> <router-link to="/add" exact>添加</router-link></li>
      </ul>
    </nav>
  </div>
</template>

<script>
    export default {
        name: "Blogheader",
      data(){
          return{

          }
      }
    }
</script>

<style scoped>
  ul{
    list-style-type: none;
    text-align: center;
    margin: 0 10px;
  }

  li{
    display: inline-block;
    margin: 0 10px;
  }

  a {
    color: #fff;
    text-decoration: none;
    padding: 12px;
    border-radius: 4px;
  }

  nav{
    background: crimson;
    padding: 30px 0;
    margin-bottom: 40px;
  }
  .router-link-active {
    background-color: rgba(255,255,255,0.8);
    color: #444;
  }
</style>
